<template>
  <view class="page flex-col">
	  <uni-nav-bar color="white" @clickLeft="back"  :fixed="true"  :background-color="navColor" status-bar
	  	left-icon="left" :border="false">
	  	<view class="top">
	  		进度详情
	  	</view>
	  </uni-nav-bar>
	  <view class="head"></view>
    <view class="box_7 flex-col">
      <text class="text_3">进度详情</text>
      <view class="list_3 flex-col">
        <view
          class="list-items_1 flex-col"
          v-for="(item, index) in model.deptConversionMetrics"
          :key="index"
        >
          <view class="box_8 flex-row">
            <view class="text-group_4 flex-col">
              
			  <view class="flex-col">
				  <text class="text_4" >{{item.deptName}}</text>
				  <text class="text_4_v" >{{item.deptFullName}}</text>
				  
			  </view>
              <text class="text_5" >执行负责人：{{item.dueRealName}}</text>
            </view>
			<view>
				<text class="text_6" >进度</text>
				<text class="text_7" >{{item.progressValue}}%</text>
			</view>
            
          </view>
          <view class="divide"></view>
          <view class="image-text_3 flex-row justify-between" @tap="godetail(item.id)">
            <text class="text-group_2"  >查看详情</text>
            <image
              class="thumbnail_9"
              referrerpolicy="no-referrer"
              src="../../static/icon/down.png"
            />
          </view>
        </view>
      </view>
      <view class="divide"></view>
    </view>
    <view class="group_3 flex-col">
      <view class="block_3 flex-row justify-between">
        <text class="text_8">{{model.title}}</text>
        <view class="text-wrapper_1 flex-col">
          <text class="text_9">{{model.eventCategoryName}}</text>
        </view>
      </view>
      <text class="text_10">{{model.startDate}}-{{model.endDate}}</text>
      <text class="text_11">分解人：{{model.splitRealName}}</text>
      <view class="block_4 flex-row">
        <view class="text-wrapper_2 flex-col" v-for="item in model.activityCategorys">
          <text class="text_12">{{item.activityCategoryName}}</text>
        </view>
       
      </view>
      <view class="divide"></view>
      <text class="text_14">进度：</text>
     <colorfulprogress :readonly="true" :progress="model.progressValue"  width="100%" ></colorfulprogress>
    </view>
  </view>
</template>
<script>
	import helper from "../../utils/helper";
	import { agingApi as agingApi } from "../../utils/api";
export default {
  data() {
    return {
		navColor: 'transparent',
		model:{},
    };
  } ,
  onPageScroll(e) {
  
  	const scrollTop = e.scrollTop; // 获取页面滚动位置
  	if (scrollTop < 100) {
  		this.navColor = `rgba(37,47,98, ${scrollTop / 100})`; // 根据滚动位置设置透明度
  	} else {
		
  		this.navColor = 'rgba(37,47,98, 1)'; // 滚动超过一定距离后设为不透明
  	}
  },
  onLoad(e){
	  this.id=e.id
	  this.getplanningdetail()
  },
  methods: {
	 godetail(id){
		uni.navigateTo({
			url:'/pages/progressdetail/index?id='+id
		}) 
	 },
	 async getplanningdetail(){
		 var result = await agingApi.getplanningdetail(this.id);
		 if(result.code==0){
			 this.model=result.data
			 this.model.startDate=this.model.startDate.replace(/-/g,'.')
			 this.model.endDate=this.model.endDate.replace(/-/g,'.')
		 }
	 },
	  back() {
	  	uni.navigateBack({
	  		delta: 1
	  	})
	  },
  }
};
</script>
<style lang="scss">
@import '../common/common.scss';
@import './index.scss';
</style>
